<script setup lang="ts">
import { defineProps } from "vue";

const props: any = defineProps({
  state: Object,
  actions: Object,
});
const goHome = () => {
  props?.actions?.setGlobalState({
    data: 'home'
  })
};
const goAbout = () => {
  props?.actions?.setGlobalState({
    data: 'about'
  })
};
</script>
<template>
  <div class="slider-container">
    <p @click="goHome">home</p>
    <p @click="goAbout">about</p>
  </div>
</template>
<style lang="less">
.slider-container {
  width: 200px;
  height: calc(100vh - 60px);
  background-color: #fff;
  border-right: 1px solid #ccc;
}
</style>
